@()(implicit request: RequestHeader)
@main("Blastn序列比对") {

	<script src="@routes.Assets.at("blocks/js/d3.v4.min.js")" type="text/javascript"></script>
	<script src="@routes.Assets.at("javascripts/blast.js")" type="text/javascript"></script>

	<div class="row">
		<div class="form-group col-sm-12">
			<h2 class="page-heading"
			style="text-align: left;
				border-bottom: 5px solid #e9f3f4">Blastn序列比对</h2>
		</div>
	</div>

	<form class="registration-form form-horizontal" id="form"
	accept-charset="UTF-8" method="post">

		<div class="form-group">
			<label class="control-label col-sm-2">Query输入方式:</label>
			<div class="col-sm-3">
				<select class="form-control myMethodChange"  name="method">
					<option selected value="text">文本</option>
					<option value="file">文件</option>
				</select>
			</div>
		</div>

		<div class="form-group" id="queryContent">
			<label class="control-label col-sm-2">Query文本:</label>
			<div class="col-sm-8">
				<textarea class="form-control" name="queryText" id="queryText" rows="5"></textarea>
				<span class="help-block">e.g.,&nbsp;<a href="javascript:void(0);"><em id="egQuery" class="myShowExample">
					示例</em></a></span>
			</div>
		</div>

		<div id="queryFile" style="display: none;">
			<div class="form-group">
				<label class="control-label col-sm-2">Query fasta文件:</label>
				<div class="col-sm-8">
					<input id="input-1" type="file" class="file control-label" name="file" data-show-preview="false"
					data-show-upload="false">
					<span class="help-block"><a href="@routes.ToolController.downloadExampleData()?fileName=blast_example.fa"><em>
						示例</em></a></span>
				</div>
			</div>
		</div>

		<div class="form-group">
			<label class="control-label col-sm-2">核酸序列数据库:</label>
			<div class="col-sm-4">
				<select class="form-control"  name="db">
				</select>
			</div>
		</div>

		<div class="form-group">
			<label class="control-label col-sm-2">Evalue:</label>
			<div class="col-sm-2">
				<input class="form-control" name="evalue" id="evalue" value="1e-5">
			</div>

			<label class="control-label col-sm-2">Word size:</label>
			<div class="col-sm-2">
				<input class="form-control" name="wordSize" id="mCharacteristic" value="28">
			</div>

		</div>

		<div class="form-group">
			<label class="control-label col-sm-2">Max target seqs:</label>
			<div class="col-sm-2">
				<input class="form-control" name="maxTargetSeqs" id="mCharacteristic" value="10">
			</div>
		</div>

		<div class="form-group">
			<div class="actions col-sm-offset-2 col-sm-2">
				<button type="button" class="btn btn-primary myRun" style="width: 90%;" id="search">
					运行</button>
			</div>

			<div class="actions  col-sm-2">
				<button type="reset" class="btn btn-primary" style="width: 90%;">
					重置</button>
			</div>
		</div>

	</form>

	<div id="result" style="display: none">
		<hr>
		<h4 style="color: black">Result:
			<button class="btn btn-primary myDownloadXls"><i class="fa fa-download"></i>&nbsp;Download</button>
		</h4>

		<iframe id="frame" style="width: 100%;
			margin-left: -7px;" height="1000px" frameborder="0" align="middle">

		</iframe>

	</div>

	<script>
			$(function () {

                Blastn.init

			})

	</script>


}